/* Header
@title
@showHome
@showShare
*/
import React,{propTypes} from 'react'
import {connect} from 'react-redux'
import RComponent from '../../components'
import classes from './Header.scss'

export class Header extends RComponent {
    constructor(props,context){
        super(props,context)
    }

    back(){
        history.back();
    }

    render(){
        return(
            <div className='Page-header'>
                <div className='header-box'>
                    <div className='header-left'>
                        {/*this.props.hasBackButton &&*/}
                        {/*<button className='pi-icon pi-icon-back' onClick={this.back.bind(this)}>*/}
                        <button className='pi-icon pi-icon-back' onClick={this.context.router.goBack}>
                        </button>
                    </div>
                    <h1>{ this.props.title || '资产配置 1'}</h1>
                    <div className='header-right'>
                        { this.props.showShare?(
                            <a className='pi-icon pi-icon-share'></a>
                        ):null}
                        { this.props.showHome?(
                            <a className='pi-icon pi-icon-home'></a>
                        ):null}
                    </div>
                </div>
            </div>
        )
    }
}

// Header.contextType={
//     router:propTypes.object
// }
Header.defaultProps={
    hasBackButton:true,
    hasHomeButton:false
}
// Header.propTypes = {
//     title:propTypes.string
// }

// export default Header
export default connect(
    state => ({
        title:state.page.title,
        showHome:state.page.showHome,
        showShare:state.page.showShare
    })
)(Header)
